<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib uri="http://www.opensymphony.com/sitemesh/page" prefix="page" %>
<html class="no-js" lang="en" >
<head>
	<meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>e-shopping</title>

	<!-- Stylesheet
	================================================== -->
	<link rel="stylesheet" href="style.css">

	<!--[if lt IE 9]>
		<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
	<![endif]-->

	<!-- Favicons
	================================================== -->
	<link rel="shortcut icon" href="images/favicon.ico">
	<link rel="apple-touch-icon" href="images/apple-touch-icon.png">
	<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
	<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">

	<script src="js/vendor/custom.modernizr.js"></script>

	<!-- Demo Examples -->
	<link rel="alternate stylesheet" type="text/css" href="css/red.css" title="red" media="all" />
	<link rel="alternate stylesheet" type="text/css" href="css/blue.css" title="blue" media="all" />
	<link rel="alternate stylesheet" type="text/css" href="css/green.css" title="green" media="all" />
	<!-- END Demo Examples -->
    
	<style>
    #themeswitcher {
        background-color: #FFFFFF;
        border: 1px solid #D1D1D1;
        height: 78px;
        overflow: hidden;
        padding: 5px 10px;
        position: fixed;
        right: 0;
        top: 150px;
        width: 40px;
        z-index: 999;
    }
    
    </style>

</head>
<body>

	<jsp:include page ="header.jsp"/>
	
		<div class="large-8 columns">

			<div class="row">
				<div class="large-12 columns">
				<div class="slider">
					<div class="flexslider">
						<ul class="slides">
                        <li>
                            <a href="#"><img src="img/01_slider.png" alt="" /></a>
                            <h3 class="flex-title">L'Achat avec divers choix</h3>
                            <p class="flex-caption">Découvrir une selection de gamme <a href="single-services.html">read more →</a></p>
                        </li>
                        <li>
                            <a href="#"><img src="img/02_slider.png" alt="" /></a>
                            <h3 class="flex-title">Meilleurs boutiques en ligne</h3>
                            <p class="flex-caption">Tout ce que vous voulez , vous le trouverez içi</p>
                        </li>
                        <li>
                            <a href="#"><img src="img/03_slider.png" alt="" /></a>
                            <h3 class="flex-title">Le géant du shopping en ligne.</h3>
                            <p class="flex-caption">Avec livraison gratuite</p>
                        </li>
						</ul>
					</div>
				</div><!-- End Slider -->
                
                <div class="services clearfix">
                    <div class="box large-4 columns">
                    <h3 class="widget-title">
                    <span><i class="fa fa-laptop"></i> Responsive Design</span>
                    </h3>
                        <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. <a href="single-services.html">read more →</a> </p>
                    </div>
                    <div class="box large-4 columns">
                    <h3 class="widget-title">
                    <span><i class="fa fa-shopping-cart"></i> eCommerce Ready</span>
                    </h3>
                        <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. <a href="single-services.html">read more →</a> </p>
                    </div>
                    <div class="box large-4 columns">
                    <h3 class="widget-title">
                    <span><i class="fa fa-heart"></i> Awesome Support</span>
                    </h3>
                        <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. <a href="single-services.html">read more →</a> </p>
                    </div>
                </div><!-- end services -->
                
                <div class="works clearfix">
                    <div class="box large-12 columns">
                        <h3 class="widget-title">
                        <span>Recent Works</span>
                        </h3>
                    </div>
                    <div class="homeportfolio large-4 columns">
                    <div class="entry">
                    <a data-gal="prettyPhoto" href="img/01_portfolio.jpg">
                        <img src="img/01_portfolio.jpg" alt="">
                        <span class="magnifier"></span>
                    </a>
                    </div>
                    <h3><a href="single-portfolio.html">Illustration of chalkboard with chalk.</a></h3>
                    </div>  
                    <div class="homeportfolio large-4 columns">
                    <div class="entry">
                    <a data-gal="prettyPhoto" href="img/03_portfolio.jpg">
                        <img src="img/02_portfolio.jpg" alt="">
                        <span class="magnifier"></span>
                    </a>
                    </div>
                    <h3><a href="single-portfolio.html">Illustration of chalkboard with chalk.</a></h3>
                    </div>  
                    <div class="homeportfolio large-4 columns">
                    <div class="entry">
                    <a data-gal="prettyPhoto" href="img/03_portfolio.jpg">
                        <img src="img/03_portfolio.jpg" alt="">
                        <span class="magnifier"></span>
                    </a>
                    </div>
                    <h3><a href="single-portfolio.html">Illustration of chalkboard with chalk.</a></h3>
                    </div>  
                </div><!-- end works -->
                
                <div class="homewidget clearfix">
                
                    <div class="box large-6 columns">
                        <h3 class="widget-title">
                            <span>Recent Posts</span>
                        </h3>
                        
                        <div class="homepost">
                            <div class="homeposttitle">
                                <h3>
                                    <i class="fa fa-pencil homeposticon"></i>
                                    <a href="single.html">Illustration of chalkboard with chalk.</a>
                                </h3>
                                <ul class="post-date clearfix">
                                    <li><i class="fa fa-calendar"></i> Oct 13, 2013</li>
                                    <li><i class="fa fa-user"></i> admin</li>
                                </ul>
                            </div>   
                        </div>
                        
                        <div class="homepost">
                            <div class="homeposttitle">
                                <h3>
                                    <i class="fa fa-film homeposticon"></i>
                                    <a href="single.html">Illustration of chalkboard with chalk.</a>
                                </h3>
                                <ul class="post-date clearfix">
                                    <li><i class="fa fa-calendar"></i> Oct 11, 2013</li>
                                    <li><i class="fa fa-user"></i> admin</li>
                                </ul>
							</div>   
                        </div>


                    </div>
                    
                    <div class="box large-6 columns">
                        <h3 class="widget-title">
                        <span>Clients Heureux</span>
                        </h3>
                        <ul class="clients">
                            <li class="entry"><a href="#"><img alt="Client #1" src="images/client.png"></a><span class="magnifier"></span></li>
                            <li class="entry"><a href="#"><img alt="Client #2" src="images/client.png"></a><span class="magnifier"></span></li>
                            <li class="entry"><a href="#"><img alt="Client #3" src="images/client.png"></a><span class="magnifier"></span></li>
                            <li class="entry"><a href="#"><img alt="Client #4" src="images/client.png"></a><span class="magnifier"></span></li>
                            <li class="entry"><a href="#"><img alt="Client #5" src="images/client.png"></a><span class="magnifier"></span></li>
                            <li class="entry"><a href="#"><img alt="Client #6" src="images/client.png"></a><span class="magnifier"></span></li>
                        </ul>
                    </div>
                    
                </div><!-- end homewidget -->
                
				</div><!-- large 12 -->
			</div><!-- end row -->
            
		</div><!-- end large 8 -->
	</div><!-- end wrapper -->


	<jsp:include page="footer.jsp"/>
    

	<script src="http://code.jquery.com/jquery-latest.min.js"></script>
    
    
	<div id="themeswitcher">
		<a href="#" rel="red" class="styleswitch"><img src="images/red.jpg" alt=""></a>	
		<a href="#" rel="blue" class="styleswitch"><img src="images/blue.jpg" alt=""></a>
		<a href="#" rel="green" class="styleswitch"><img src="images/green.jpg" alt=""></a>
	</div>
    
	<script type="text/javascript" src="switcher/fswit.js"></script>
    
	<script src="js/jquery.flexslider.js"></script>
    <script src="js/tinynav.min.js"></script>
	<script src="js/menu_min.js"></script>
	<script src="js/foundation.min.js"></script>
	<script src="js/jquery.prettyPhoto.js"></script>
	<script src="js/script.js"></script>

    
</body>
</html>